<template>
	<view class="flow-container" style="background: rgb(247 247 247)">
		<view style="background: #ffff">
			<u-tabs :list="list" @click="click"></u-tabs>
		</view>
		<!-- 使用系统自带下拉刷新，移动端偶尔不支持， -->
		<!-- <view v-if="isInited">
			<view v-show="currentIndex === index" v-for="(data, index) in list" :key="index">
				<vol-table
					titleField="WorkName"
					:columns="data.columns"
					:ref="'list' + index"
					@loadBefore="loadBefore"
					@rowButtonClick="rowButtonClick"
					@loadAfter="loadAfter"
					@rowButtons="getRowButtons"
					v-if="data.inited"
					:url="data.url"
				></vol-table>
			</view>
		</view> -->
		<scroll-view
			show-scrollbar
			:refresher-triggered="refresh"
			@refresherrefresh="onRefresh"
			scroll-y="true"
			refresher-background="#f9f9f9"
			refresher-enabled="true"
			:refresher-threshold="100"
		>
			<view v-show="currentIndex === index" v-for="(data, index) in list" :key="index">
				<vol-table
					titleField="WorkName"
					:columns="data.columns"
					:ref="'list' + index"
					@loadBefore="loadBefore"
					@rowButtonClick="rowButtonClick"
					@loadAfter="loadAfter"
					@rowButtons="getRowButtons"
					v-if="data.inited"
					:url="data.url"
				>
					<u-loadmore :status="loadmoreStatus" :loading-text="loadingText" :loadmore-text="loadmoreText" :nomore-text="nomoreText" />
				</vol-table>
			</view>
			<!-- <view class="goTop" @click="goTopFn">
				<uni-icons type="arrow-up" color="#fff" size="28"></uni-icons>
			</view> -->
		</scroll-view>
		<!-- <vol-tabbar :index="1"></vol-tabbar> -->
		<!-- <view class="popup" v-show="popupShow">
			<view class="popup-content">
				<view class="popup-content-titel">提示</view>
				<view class="popup-content-text">该版本已停止使用，请联系管理员获取最新版本</view>
			</view>
		</view> -->
		<u-modal :show="titelShow" :title="titel" :content="titelContent" :confirmText="modalBtnText" @confirm="confirmFn"></u-modal>
	</view>
</template>

<script>
/*
	被审批的表，需要添加移动端菜单，并且给当前角色分配审批权限
	*/
import { downloadApp, installApp } from '@/util/upgrade.js'; //软件更新
import { setPermissionsInform } from '../../util/getPush.js'; //通知栏权限
export default {
	data() {
		return {
			// scrollTop: 100,
			// old: {
			// 	scrollTop: 0
			// },
			// popupShow: false,
			titelShow: false,
			titel: '',
			titelContent: '',
			modalBtnText: '',
			downloadUrl: '',
			loadmoreStatus: 'loading',
			loadingText: '努力加载中', //loading
			loadmoreText: '上拉加载更多', //loadmore
			nomoreText: '没有更多了', //nomore
			refresh: false,
			isInited: false,
			currentIndex: 0,
			value: '',
			offRefresh: null,
			list: [
				{
					name: '待审批',
					url: 'api/Sys_WorkflowtableChange/getPageData',
					inited: true,
					badge: {
						value: 0
					},
					columns: this.getAwaitColumns()
				},
				{
					name: '我的审批',
					url: 'api/Sys_WorkFlowTable/getPageData',
					inited: false,
					badge: {
						value: 0
					},
					columns: this.getColumns()
				},
				{
					name: '已审批',
					url: 'api/Sys_WorkFlowTable/getPageData',
					badge: {
						value: 0
					},
					inited: false,
					columns: this.getColumns()
				},
				{
					name: '我的提交',
					url: 'api/Sys_WorkFlowTable/getPageData',
					badge: {
						value: 0
					},
					inited: false,
					columns: this.getColumns()
				}
			],
			initData: [],
			Ip:'',
		};
	},
	onLoad() {
		this.getLoginInofo();
		this.isInited = true;
		this.Ip = this.$store.state.IP; // 获取当前域名
		// this.http.post('api/Sys_Dictionary/GetVueDictionary', ['资料库分类'], false).then(result => {

		// 	let list = result[0].data.map(x => {
		// 		return {
		// 			key: x.key,
		// 			name: x.value,
		// 			url: "api/App_DataList/getList?type=" + x.key
		// 		}
		// 	})
		// 	this.list.push(...list);

		// 	this.initData = this.list.map(x => {
		// 		return false
		// 	});
		// 	this.initData[0] = true;
		// 	this.isInited = true;
		// })
	},
	onShow() {
		this.getLoginInofo();
		this.tableRefresh();
		// setPermissionsInform()
		// plus.android.requestPermissions(
		// 	['android.permission.ACCESS_FINE_LOCATION'],
		// 	function (resultObj) {
		// 		console.log('resultObj---', resultObj);
		// 	},
		// 	function (error) {
		// 		console.log('申请权限错误：' + error.code + ' = ' + error.message);
		// 	}
		// );
	},
	methods: {
		toJSON() {},
		// 版本更新增加
		showPopup() {
			// this.$refs.popup.open();
		},
		//安装app
		handleInstallApp() {
			//下载完成才能安装，防止下载过程中点击
			if (this.isDownloadFinish && this.fileName) {
				installApp(this.fileName, () => {
					//安装成功,关闭升级弹窗
					// this.$refs.popup.close();//未注册
				});
			}
		},
		// 版本更新增加end
		confirmFn() {
			this.titelShow = false;
			if (this.modalBtnText == '立即更新') {
				//显示升级进度
				// this.showPopup();
				if (this.downloadUrl) {
					this.isStartDownload = true;
					//开始下载App
					downloadApp(this.downloadUrl, (current) => {
						//下载进度
						this.progress = current;
					})
						.then((fileName) => {
							//下载完成
							this.isDownloadFinish = true;
							this.fileName = fileName;
							if (fileName) {
								//自动安装App
								this.handleInstallApp();
							}
						})
						.catch((e) => {
							console.log(e, 'e');
						});
				} else {
					uni.showToast({
						title: '下载链接不存在',
						icon: 'none'
					});
				}
			} else {
				this.versionsShow = false;
				// this.$store.commit('clearUserInfo');
				// #ifdef APP-PLUS
				    plus.runtime.openURL(this.Ip+"api/AppUpdate/appup");
				// #endif
				// "http://192.168.11.8:8883/api/AppUpdate/appup"
				// this.http.get('/api/AppUpdate/appup','',true).then((res) => {
				// 	console.log('+++++======');
				// 	console.log(res);console.log('+++++======');
				// });
				// /api/AppUpdate/appup
				// 原来
				// uni.reLaunch({
				// 	url: '/pages/login/login'
				// });
			}
		},
		getLoginInofo() {
			const userName = uni.getStorageSync('userName');
			const appVersion = uni.getSystemInfoSync().appVersion;
			// console.log(appVersion);
			const url = 'api/Appversion/version?version=' + appVersion + '&UserName=' + userName;
			// console.log("url",url)
			try {
				this.http.post(url).then((x) => {
					console.log("xXXXXXXXX",x)
					this.popupShow = !x;
					this.titelShow = !x;
					this.titel = '提示';
					// this.titelContent = '当前版本或该用户账号不可用，请联系管理员处理。';
					this.titelContent = '当前版本或该用户账号不可用，请去下载新版本';
					this.modalBtnText = '确定';
					if (x) {
						uni.showTabBar();
					} else {
						uni.hideTabBar();
					}
				});
			} catch (e) {
				//TODO handle the exception
				console.log(e);
			}
			
		},
		getUpdateVersion() {
			const systemInfo = uni.getSystemInfoSync();
			let version = '1.0.0';
			let verCode = 0;
			// 应用程序版本号
			// #ifdef APP
			version = plus.runtime.version;
			verCode = plus.runtime.versionCode;
			// #endif
			// #ifdef H5
			version = systemInfo.appVersion;
			verCode = systemInfo.appVersion;
			// #endif
			// console.log(appVersion);
			const url = 'api/Appversion/version?version=' + appVersion + '&UserName=' + userName;

			try {
				this.http.post(url).then((res) => {
					if (verCode < res.versionCode) {
						this.titelShow = true;
						this.titel = '版本更新';
						this.titelContent = res.versionDesc;
						this.modalBtnText = '立即更新';
						this.downloadUrl = res.downloadUrl + res.appName;
						uni.hideTabBar();
					}
				});
			} catch (e) {
				//TODO handle the exception
				console.log(e);
			}
		},
		scroll: function (e) {
			console.log(e);
			this.old.scrollTop = e.detail.scrollTop;
		},
		goTopFn() {
			console.log('被点击了');
			this.scrollTop = this.old.scrollTop;
			this.$nextTick(function () {
				this.scrollTop = 0;
			});
		},
		async onRefresh() {
			console.log('下拉刷新');
			//打开下拉刷新
			this.refresh = true;
			this.offRefresh = setTimeout(() => {
				uni.showToast({
					icon: 'error',
					title: '刷新失败'
				});
				// this.refresh = true;
				setTimeout(() => {
					this.refresh = false;
				}, 100);
			}, 60000);
			//判断当前路由，选择ref内对应的listindex
			let list = 'list' + this.currentIndex;
			if (!this.$refs[list]) return;
			let status = await this.$refs[list][0].testSearch();

			console.log('status', status);
			// if (status) {
			uni.showToast({
				icon: 'success',
				title: '刷新成功'
			});
			// this.refresh = true;
			setTimeout(() => {
				this.refresh = false;
			}, 100);

			clearTimeout(this.offRefresh);
			// }
		},
		//待审批的列配置
		getAwaitColumns() {
			return [
				{
					field: 'WorkFlowTable_Id',
					title: 'ID',
					type: 'guid',
					width: 110,
					hidden: true,
					readonly: true,
					require: true,
					align: 'left'
				},
				{
					field: 'notice',
					title: '是否已通知',
					type: 'int',
					hidden: true,
					bind: {
						key: 'enable',
						data: []
					},
					width: 130,
					align: 'left'
					// sort: true
				},
				{
					field: 'WorkName',
					title: '业务名称',
					type: 'string',
					width: 120,
					align: 'left'
				},
				{
					field: 'StepName',
					title: '节点名称',
					type: 'string',
					width: 120,
					align: 'left'
				},
				{
					field: 'yh',
					title: '审批用户',
					type: 'string',
					width: 120,
					align: 'left',
					bind: {
						key: '用户',
						data: []
					}
				},
				{
					field: 'je',
					title: '审批角色',
					type: 'string',
					width: 120,
					align: 'left',
					bind: {
						key: 'roles',
						data: []
					}
				},
				{
					field: 'bm',
					title: '审批部门',
					type: 'string',
					width: 120,
					align: 'left',
					bind: {
						key: '组织机构',
						data: []
					}
				},
				{
					field: 'Changetime',
					title: '生成时间',
					type: 'datetime',
					width: 150,
					align: 'left',
					sort: true
				}
			];
		},
		getColumns() {
			return [
				{
					field: 'WorkFlowTable_Id',
					title: 'WorkFlowTable_Id',
					type: 'guid',
					width: 110,
					hidden: true,
					readonly: true,
					require: true,
					align: 'left'
				},
				//  {field:'WorkFlow_Id',title:'流程id',type:'guid',width:110,hidden:true,align:'left'},
				{
					field: 'WorkName',
					title: '流程名称',
					type: 'string',
					width: 130,
					align: 'left',
					sort: true
				},
				//  {field:'WorkTableKey',title:'表主键id',type:'string',width:180,hidden:true,align:'left'},
				// {field:'WorkTable',title:'表名',type:'string',width:100,align:'left'},
				{
					field: 'WorkTableName',
					title: '业务名称',
					type: 'string',
					width: 120,
					align: 'left'
				},
				// {field:'CurrentStepId',title:'当前审核节点ID',type:'string',width:110,align:'left'},
				{
					field: 'StepName',
					title: '当前节点',
					type: 'string',
					width: 120,
					align: 'left'
				},
				{
					field: 'AuditStatus',
					title: '审批状态',
					type: 'int',
					bind: {
						key: 'audit',
						data: []
					},
					width: 110,
					align: 'left'
				},
				{
					field: 'Creator',
					title: '提交人',
					type: 'string',
					width: 100,
					align: 'left'
				},
				{
					field: 'CreateDate',
					title: '提交时间',
					type: 'datetime',
					width: 150,
					align: 'left',
					sort: true
				}
			];
		},
		rowClick(row) {},
		getRowButtons(index, row, callback) {
			let buttons = [];
			if (this.currentIndex === 0) {
				buttons = [
					{
						text: '审批',
						shape: 'circle',
						type: 'error'
						//	plain: true
					}
				];
			} else {
				buttons = [
					{
						text: '查看',
						shape: 'circle',
						type: 'primary'
					}
				];
			}
			callback(buttons);
		},
		rowButtonClick(btn, rowindex, row) {
			//审批
			if (this.currentIndex === 0) {
			} else {
				//查看
			}
			//{WorkTable:options.WorkTable,WorkTableKey:options.WorkTableKey}
			uni.navigateTo({
				url: '/pages/flow/audit/audit?workTable=' + row.WorkTable + '&tableKey=' + row.WorkTableKey
			});
			//this.$toast('审批')
		},
		click(item) {
			this.currentIndex = item.index;
			this.list[item.index].inited = true;
			this.tableRefresh();
		},
		search() {
			console.log('审批后');
			//审批后
			this.$refs.list0[0].load(null, true);
			this.$refs.list1 && this.$refs.list1[0].load(null, true);
		},
		loadBefore(params, callback) {
			// if (this.currentIndex===0) {
			// 	params.
			// }
			params.value = this.currentIndex;
			//分页时加载数据时会触发
			//console.log('table加载数据：' + JSON.stringify(params))
			callback(true);
		},
		loadAfter(data, callback) {
			const index = 'list' + this.currentIndex;
			if (data.rows.length < 30) {
				this.loadmoreStatus = 'nomore';
			} else {
				this.loadmoreStatus = 'loadmore';
			}
			// console.log('data', data);
			// console.log('data.lenght', data.rows.lenght < 30);
			// console.log('index', index);
			// console.log('list', this.$refs[index]);
			// console.log('list。data', this.$refs[index][0]._data.rowsData);
			// console.log('list。data.length', this.$refs[index][0]._data.rowsData.length);
			//if (!this.list[this.currentIndex].badge.value) {
			this.list[this.currentIndex].badge.value = data.total;
			//}
			//分页时加载数据时会触发
			data.rows.forEach((row) => {
				if (row.img) {
					row.img = this.base.getUrl(this.http.ipAddress, row.img, row.size);
				}
			});
			callback(true);
		},
		//vol-table 刷新
		async tableRefresh() {
			//判断当前路由，选择ref内对应的listindex
			let list = 'list' + this.currentIndex;
			if (!this.$refs[list]) return;
			let status = await this.$refs[list][0].testSearch();
			return status;
		}
	}
	//下拉刷新
	// async onPullDownRefresh() {
	// 	console.log('开启下拉');
	// 	this.tableRefresh();
	// 	uni.stopPullDownRefresh();
	// 	uni.showToast({
	// 		icon: 'success',
	// 		title: '刷新成功'
	// 	});
	// }
};
</script>

<style lang="less" scoped>
.tabbar {
	z-index: 1000; /* 比遮罩层的z-index高，确保tabbar在遮罩层上方 */
}
.popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 99999999;
	background-color: rgba(0, 0, 0, 0.3);
	.popup-content {
		position: absolute;
		width: 400rpx;
		height: 400rpx;
		top: 50%;
		left: 50%;
		padding: 20rpx;
		transform: translate(-50%, -50%);
		border-radius: 10rpx;
		background-color: #fff;
		z-index: 99999;
		.popup-content-titel {
			font-size: 20px;
			line-height: 40px;
			text-align: center;
		}
	}
}
.goTop {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	bottom: 150rpx;
	right: 50rpx;
	width: 80rpx;
	height: 80rpx;
	border-radius: 40rpx;
	background-color: rgba(0, 0, 0, 0.5);
}
.search-header {
	padding: 16rpx;
	display: flex;
	align-items: center;
}

.table-demo {
	background: #f4f4f4;
	padding: 10rpx;
}

.grid-item {
	margin: 8rpx 16rpx;
	padding: 16rpx;
	border-radius: 8rpx;
	display: flex;
	background: #ffff;

	.grid-content {
		display: flex;
		flex: 1;
		flex-direction: column;
		padding-right: 20rpx;

		.grid-title {
			font-size: 32rpx;
			overflow: hidden;
			display: -webkit-box;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
		}

		.grid-bottom {
			flex: 1;
			align-items: flex-end;
			padding-top: 20rpx;
			display: flex;
			font-size: 24rpx;
			color: #959595;

			.grid-bottom-left {
				flex: 1;
				width: 0;
			}

			.success,
			.error {
				margin-right: 30rpx;
			}

			.success {
				color: #00aa00;
			}

			.error {
				color: #e54648;
			}
		}
	}
}

.grid-item:first-child {
	margin-top: 16rpx;
}
</style>
<style scoped>
.flow-container /deep/ .vol-table-list {
	padding: 0 !important;
}
</style>
